<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>MeteoCal - Event List</title>
	<link rel="stylesheet" type="text/css" href="${request.contextPath}/resources/css/main.css" />
    </h:head>
    <h:body>
        <p:layout fullPage="true">
            <p:layoutUnit position="north" size="60" resizable="false" closable="false" collapsible="false">
		<ui:include src="/includes/header.xhtml"/>
            </p:layoutUnit>
	    <p:layoutUnit position="center" class="content">
		<h1>Event List</h1>
		<h:form>
		    
			<div id="event-container">
                   <h:outputText escape="false" value="#{bundle.ListEventEmpty}" rendered="#{eventController.items.rowCount == 0}"/>
                <h:panelGroup rendered="#{eventController.items.rowCount > 0}">
         

                      <ui:repeat var="e" value="#{eventController.items}">
				<div class="event">
					
                                <h:commandLink action="#{eventController.eventPageView}"><h2>#{e.eventName}</h2></h:commandLink>

				    <h:outputText value="#{e.eventDate}">
                                        <f:convertDateTime  timeZone="GMT+1" pattern="MM/dd/yyyy" />
                                    </h:outputText>
                                    <h:outputText value="#{e.eventStartTime}">
					<f:convertDateTime timeZone="GMT+1" pattern=" h:mm a" />
				    </h:outputText>
				    <p>#{e.eventCity}</p>
				    <p>#{e.userEmail.userFirstName} #{e.userEmail.userLastName}</p>
				    <h:commandLink action="#{eventController.eventPageView}" value="View"/>
				    <h:outputText value=" "/>
				    <h:commandLink action="#{eventController.eventPageEdit}" value="Edit"/>
                                    <h:outputText value=" "/>
				    <h:commandLink action="#{eventController.eventPageDelete}" value="Delete"/>
				</div>
			    </ui:repeat>
                    <div> 
                    <br/><br/>
                    <h:outputText value="#{eventController.pagination.pageFirstItem + 1}..#{eventController.pagination.pageLastItem + 1}/#{eventController.pagination.itemsCount}"/>&nbsp;
                    <h:commandLink action="#{eventController.previouPage}" value="#{bundle.Previous}" rendered="#{eventController.pagination.hasPreviousPage}"/>&nbsp;
                    <h:commandLink action="#{eventController.nextPage}" value="#{bundle.Next}" rendered="#{eventController.pagination.hasNextPage}"/>&nbsp;
                    </div>
                    </h:panelGroup>
			</div>
		</h:form>
	    </p:layoutUnit>
	    <p:layoutUnit position="south" size="80" resizable="false" closable="false" collapsible="false">
		<ui:include src="/includes/footer.xhtml"/>
	    </p:layoutUnit>
        </p:layout>
    </h:body>
</html>